www.gusucode.com > 247 - 展示类 html98精品模板 > 247 - 展示类/css/style.css
/*
Author: W3layout
Author URL: http://w3layouts.com
License: Creative Commons Attribution 3.0 Unported
License URL: http://creativecommons.org/licenses/by/3.0/
*/
/* reset */
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,dl,dt,dd,ol,nav ul,nav li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline;}
article, aside, details, figcaption, figure,footer, header, hgroup, menu, nav, section {display: block;}
ol,ul{list-style:none;margin:0;padding:0;}
blockquote,q{quotes:none;}
blockquote:before,blockquote:after,q:before,q:after{content:'';content:none;}
table{border-collapse:collapse;border-spacing:0;}
/* start editing from here */
a{text-decoration:none;}
.txt-rt{text-align:right;}/* text align right */
.txt-lt{text-align:left;}/* text align left */
.txt-center{text-align:center;}/* text align center */
.float-rt{float:right;}/* float right */
.float-lt{float:left;}/* float left */
.clear{clear:both;}/* clear float */
.pos-relative{position:relative;}/* Position Relative */
.pos-absolute{position:absolute;}/* Position Absolute */
.vertical-base{ vertical-align:baseline;}/* vertical align baseline */
.vertical-top{ vertical-align:top;}/* vertical align top */
.underline{ padding-bottom:5px; border-bottom: 1px solid #eee; margin:0 0 20px 0;}/* Add 5px bottom padding and a underline */
nav.vertical ul li{ display:block;}/* vertical menu */
nav.horizontal ul li{ display: inline-block;}/* horizontal menu */
img{max-width:100%;}
/*end reset*/
@font-face {
font-family: 'AmbleRegular';
src: url( ../fonts/Amble-Light-webfont.ttf ) format("truetype");
}
body{
font-family: 'AmbleRegular';
}
.wrap{
width:80%;
margin:0 auto;
-moz-transition:all .2s linear;
-webkit-transition:all .2s linear;
-o-transition:all .2s linear;
-ms-transition:all .2s linear;
}
.total{
-webkit-box-shadow: 0px 0px 15px #E3E3E3;
box-shadow: 0px 0px 15px #E3E3E3;
-o-box-shadow: 0px 0px 15px #E3E3E3;
-moz-box-shadow: 0px 0px 15px #E3E3E3;
}
/*--menu--*/
.menu{
background:url(../images/menu-bg.gif);
}
.top-nav li {
color: #FBFAFA;
border: none;
float: left;
width:24.86%;
line-height: 20px;
border-right: 2px ridge #FFF;
}
.top-nav li:last-child{
border-right:none;
}
.top-nav li.active a, .top-nav li a:hover {
color:#547D9F;
}
.top-nav li a {
display: block;
color:#707070;
padding:20px 0 16px;
height: auto !important;
text-align: center;
font-size: 18px;
font-weight: bold;
}
.h-bg{
padding:5%;
}
.bot2 {
width: 100%;
background: #495866 url(../images/head-top.gif) 0 bottom repeat-x;
height: 17px;
}
.header{
background: url(../images/header-bg.gif);
padding: 2% 3% 0;
}
.banner{
padding-bottom: 2%;
background: url(../images/banner-bottom.png) no-repeat center bottom;
}
.logo{
float:left;
margin-top: -2%;
}
.header-top{
padding-bottom: 20px;
}
.header-bot{
padding:3% 0;
}
.banner-top{
padding:2% 2%;
background: #FFF;
}
/*--dropdown--*/
.header_top_right {
float: right;
}
.desc { color:#6b6b6b;}
.desc a {color:#0092dd;}
.dropdown dd, .dropdown dt, .dropdown ul { margin:0px; padding:0px; }
.dropdown dd { position:relative; }
.dropdown a, .dropdown a:visited { color:#000; text-decoration:none; outline:none;}
.dropdown dt a:hover { color:#000;}
.dropdown dt a {background:url(../images/arrow.png) no-repeat scroll right center; display:block; padding-right:8px;height:38px;
border-radius: 0 0 4px 4px;
width:150px;}
.dropdown dt a span {cursor:pointer; display:block; padding:12px 10px;font-size: 11px;}
.dropdown dd ul { background:#495866 none repeat scroll 0 0;color:#C5C0B0; display:none;
left:0px; padding:5px 0px; position:absolute; top:2px; width:auto; min-width:170px; list-style:none;}
.dropdown span.value { display:none;}
.dropdown dd ul li a { padding:5px; display:block;font-size: 13px;}
.dropdown dd ul li a:hover { background-color:#354655;}
.dropdown img.flag { border:none; vertical-align:middle; margin-left:10px; }
.flagvisibility { float: right;}
/*--dropdown--*/
.dropdown {
display: block;
display: inline-block;
margin: 0px 3px;
position: relative;
z-index: 9999;
}
/* ===[ For demonstration ]=== */
/* ===[ End demonstration ]=== */
.dropdown .dropdown_button {
cursor: pointer;
width: auto;
display: inline-block;
padding: 4px 12px;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
font-weight: bold;
color:#000;
line-height:29px;
text-decoration: none !important;
font-size: 11px;
}
.dropdown input[type="checkbox"]:checked + .dropdown_button {
}
.dropdown input[type="checkbox"] + .dropdown_button .arrow {
display: inline-block;
width: 0px;
height: 0px;
border-top: 5px solid #000;
border-right: 5px solid transparent;
border-left: 5px solid transparent;
}
.dropdown input[type="checkbox"]:checked + .dropdown_button .arrow { border-color:#1B5080 transparent transparent transparent }
.dropdown .dropdown_content {
position: absolute;
border: 1px solid #777;
padding: 0px;
background:#495866;
margin: 0;
display: none;
}
.dropdown .dropdown_content li {
list-style: none;
margin-left: 0px;
line-height: 16px;
border-top: 1px solid #4A5C66;
border-bottom: 1px solid #5A717E;
margin-top: 2px;
margin-bottom: 2px;
}
.dropdown .dropdown_content li:hover {
border-top-color: #555;
border-bottom-color: #555;
background:#354655;
}
.dropdown .dropdown_content li a {
display: block;
padding: 2px 7px;
padding-right: 15px;
color:#fff;
font-size:13px;
text-decoration: none !important;
white-space: nowrap;
}
.dropdown .dropdown_content li:hover a {
color: white;
text-decoration: none !important;
}
.dropdown input[type="checkbox"]:checked ~ .dropdown_content { display: block }
.dropdown input[type="checkbox"] { display: none }
/*end-dropdown*/
/**** Header Top Right ****/
.login{
float:left;
margin:0 10px;
width: 55px;
height: 37px;
display: block;
border:none;
text-align: center;
margin-right: 6%;
}
a.button {
display: inline-block;
text-decoration: none;
cursor: pointer;
background:#EEE;
border: 1px solid #C9C9C9;
font-size: 13px;
line-height: 16px;
font-weight: bold;
text-transform: uppercase;
float: left;
padding:2.5% 5%;
color:#888;
}
a.button:hover{
color:#000;
}
.details-list {
float: left;
background:url(../images/add.gif);
}
a.details {
display: block;
width:40px;
height:40px;
background: url(../images/cart.png);
}
.cart{
float:right;
width:41%;
}
.ph-no{
float:left;
margin-right: 6%;
}
.text1 {
display: block;
color: #969696;
font-weight: normal;
text-transform: uppercase;
font-size: 20px;
line-height: 24px;
padding-left: 24px;
}
.text2 {
display: block;
color: #4B7092;
font-weight: normal;
font-size: 25px;
line-height: 30px;
margin-top: -3px;
}
h4 {
background: #5D8BAC url(../images/h1.gif) 0 bottom repeat-x;
color: #FFF;
text-transform: uppercase;
height: 52px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
padding-left: 29px;
padding-top: 16px;
font-family: 'Open Sans',sans-serif;
margin: 0;
font-weight: 600;
font-size: 15px;
line-height: 1.2em;
margin-bottom: 33px;
}
#categories_block_left ul.tree li {
background: #FEFEFE url(../images/bg3.gif) 0 bottom repeat-x;
line-height: 1.2em;
font-size: 11px;
position: relative;
display: block;
}
#categories_block_left ul.tree a {
color: #7F7F7F;
display: block;
padding: 11px 0 11px 39px;
text-transform: uppercase;
}
#categories_block_left h4 {
margin-bottom: 0 !important;
}
/*--content--*/
/* GRID OF THREE ============================================================================= */
.col_1_of_3{
display: block;
float:left;
margin: 1% 0 1% 1.6%;
}
.col_1_of_3:first-child { margin-left: 0; }
.span_1_of_3 {
width: 29.2%;
padding:1.5%;
float:left;
}
.span_1_of_3 p {
font-size:0.8125em;
padding:0.5em 0;
color: #333;
line-height: 1.5em;
}
/***** Media Quries *****/
@media only screen and (max-width: 1024px) {
.wrap{
width:95%;
}
}
/* GO FULL WIDTH AT LESS THAN 640 PIXELS */
@media only screen and (max-width: 640px) and (min-width: 480px) {
.wrap{
width:95%;
}
.col_1_of_3{
margin: 1% 0 1% 0%;
}
.span_1_of_3 {
width:94%;
padding:3%;
}
}
/* GO FULL WIDTH AT LESS THAN 480 PIXELS */
@media only screen and (max-width: 480px) {
.wrap{
width:95%;
}
.col_1_of_3{
margin: 1% 0 1% 0%;
}
.span_1_of_3 {
width:92%;
padding:4%;
}
}
.banner-box3 {
background: url(../images/banner-bg.gif);
height: 79px;
width: 100%;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
position: relative;
padding-left: 26px;
padding-top: 13px;
}
.link2 {
position: absolute;
right: 0;
top: 0;
display: block;
height: 79px;
width: 56px;
background: url("../images/marker2.gif") no-repeat scroll 0 0/ cover rgba(0, 0, 0, 0);
}
.link2:hover {
background: url("../images/marker2-hov.gif") no-repeat scroll 0 0/ cover rgba(0, 0, 0, 0);
}
.text20 {
display: block;
color: #FFF;
text-transform: uppercase;
font-size: 20px;
line-height: 20px;
font-weight: normal;
margin-bottom: 6px;
}
.text21 {
display: block;
color: #FFF;
text-transform: uppercase;
font-size: 30px;
margin-top: -2px;
line-height: 30px;
font-weight: bold;
}
.span4 img{
display:block;
}
/* GRID OF Content and sidebar ============================================================================= */
.cont{
display: block;
float:left;
margin: 1% 0 1% 0;
}
.rsidebar{
display: block;
float:left;
margin: 1% 0 1% 1.6%;
}
.span_2_of_3 {
width: 63.1%;
padding:1.5%;
}
.span_2_of_3 h3,
.span_1_of_3 h3 {
color:#547D9F;
margin-bottom:0.5em;
font-size:1.5em;
line-height: 1.2;
font-weight : normal;
margin-top: 0px;
letter-spacing: -1px;
}
.span_2_of_3 p,
.span_1_of_3 p {
font-size:0.8125em;
padding:0.5em 0;
color: #333;
line-height: 1.5em;
}
/***** Media Quries *****/
@media only screen and (max-width: 1024px) {
.wrap{
width:95%;
}
}
/* GO FULL WIDTH AT LESS THAN 640 PIXELS */
@media only screen and (max-width: 640px) and (min-width: 480px) {
.wrap{
width:95%;
}
.cont{
margin: 1% 0 1% 0%;
}
.rsidebar{
margin:0;
}
.span_2_of_3 {
width:94%;
padding:3%;
}
.span_1_of_3 {
width:94%;
padding:3%;
}
}
/* GO FULL WIDTH AT LESS THAN 480 PIXELS */
@media only screen and (max-width: 480px) {
.wrap{
width:95%;
}
.cont{
margin: 1% 0 1% 0%;
}
.rsidebar{
margin:0;
}
.span_2_of_3 {
width:92%;
padding:4%;
}
.span_1_of_3 {
width:92%;
padding:4%;
}
}
h4 {
background: #495866 url(../images/featured.gif) 0 bottom repeat-x;
}
h4.title_block{
background: #5D8BAC url(../images/new.gif) 0 bottom repeat-x;
color: #FFF;
text-transform: uppercase;
height: 52px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
padding-left: 29px;
padding-top: 16px;
margin: 0;
font-weight: 600;
font-size: 15px;
line-height: 1.2em;
margin-bottom: 33px;
}
.grids {
background:url(../images/feat-bg.gif);
text-align: left;
margin-bottom: 29px;
float: left;
position: relative;
overflow: hidden;
border: 1px solid #D9D9D9;
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
-ms-box-sizing: border-box;
}
.price {
overflow: hidden;
border-top: 1px solid #EAEAEA;
background: #FFF url(../images/price.gif) 0 0 repeat-x;
}
.bot1 {
width: 59%;
padding:0 10px;
float:left;
}
.bot1 h5 a{
color:red;
}
span.price-old{
color:red;
}
p.title {
font-size: 13px;
color:#888;
margin-bottom: -17px;
}
span.actual{
color:#000;
}
.cart1{
float:right;
background:url(../images/add.gif);
padding: 15px;
}
.span_1_of_bottom {
width: 29.5%;
float:left;
margin-right:5.69%;
}
.span_1_of_bottom1 {
width: 29.5%;
float:left;
}
.product-image {
float: left;
width:62%;
}
.product-details {
float: right;
width: 31%;
}
.product-name{
margin-bottom:10%;
}
.product-name p a{
font-size: 13px;
font-weight: bold;
line-height: 18px;
margin: 0 0 8px 0;
min-height: 54px;
}
p.old-price {
float: left;
font-weight: bold;
padding: 0 5px 0 5px;
min-width: 80px;
height: 26px;
line-height: 26px;
background:#4B7092;
}
span.reducedfrom {
text-decoration: line-through;
color:#fff;
}
p.special-price{
line-height: 2em;
font-size: 16px;
font-weight: bold;
color: #333;
}
.link-cart {
clear: both;
float: left;
background: url(../images/arrow1.png)no-repeat 73px;
padding: 0 14px 0 0;
font-size: 13px;
font-weight: bold;
color: #272727;
}
.link-cart:hover{
text-decoration:underline;
}
.sidebar{
margin-bottom:10%
}
.grid-bottom{
margin-bottom: 15px;
}
/*--Footer--*/
/* GRID OF FOUR ============================================================================= */
.footer{
background:url(../images/foot-bg.gif);
}
.col_1_of_4{
display: block;
float:left;
margin: 1% 0 1% 1.6%;
}
.col_1_of_4:first-child { margin-left: 0; } /* all browsers except IE6 and lower */
.span_1_of_4 {
width: 20.8%;
padding:1.5%;
}
.span_1_of_4 h3{
color:#fff;
margin-bottom: .5em;
font-size:1.5em;
line-height: 1.2;
font-weight : normal;
margin-top: 0px;
letter-spacing: -1px;
}
.span_1_of_4 p {
font-size:0.8125em;
padding:0.5em 0;
color: #333;
line-height: 1.5em;
}
/***** Media Quries *****/
@media only screen and (max-width: 1024px) {
.wrap{
width:95%;
}
}
/* GO FULL WIDTH AT LESS THAN 640 PIXELS */
@media only screen and (max-width: 640px) and (min-width: 480px) {
.wrap{
width:95%;
}
.col_1_of_4{
margin: 1% 0 1% 0%;
}
.span_1_of_4 {
width:94%;
padding:3%;
}
}
/* GO FULL WIDTH AT LESS THAN 480 PIXELS */
@media only screen and (max-width: 480px) {
.wrap{
width:95%;
}
.col_1_of_4{
margin: 1% 0 1% 0%;
}
.span_1_of_4 {
width:92%;
padding:4%;
}
}
.span_1_of_4 ul li{
padding: 0 0 7px;
}
.span_1_of_4 ul li a {
color:#839BB2;
font-size:13px;
-moz-transition: background 0.5s ease;
-o-transition: background 0.5s ease;
-webkit-transition: background 0.5s ease;
}
.footer-lastgrid ul {
padding-top: 5px;
}
.footer-lastgrid ul li {
display: inline-block;
}
.footer-lastgrid ul li a {
padding: 0 5px;
}
.footer-lastgrid p {
color:#839BB2;
padding-top: 25px;
}
.footer-lastgrid p a{
color:#fff;
}
.footer-lastgrid p a:hover{
text-decoration:underline;
}
/*--Single--*/
.info-Box{
padding: 0 0 20px;
}
li.first{
padding: 10px 0;
border-bottom:1px solid #CCC;
}
li.first a{
font-weight:bold;
font-size:13px;
color:#333;
}
li.last{
padding: 10px 0;
}
li.last a{
font-weight:bold;
font-size:13px;
color:#333;
}
li.last a:hover, li.first a:hover, .manu-info h5 a:hover{
color:#4B7092;
}
.box_wrapper_title {
padding: 10px 12px 10px 12px;
font-size: 20px;
line-height: 21px;
color: #2E2E2E;
margin-bottom: 20px;
border-bottom: 1px solid #CFCFCF;
font-weight: bold;
-webkit-border-radius: 2px;
border-radius: 2px;
background: #F6F6F6;
background: -moz-linear-gradient(top,#F6F6F6 0%,#E6E6E6 100%);
background: -webkit-gradient(linear,left top,left bottom,color-stop(0%,#F6F6F6),color-stop(100%,#E6E6E6));
background: -webkit-linear-gradient(top,#F6F6F6 0%,#E6E6E6 100%);
background: -o-linear-gradient(top,#F6F6F6 0%,#E6E6E6 100%);
background: -ms-linear-gradient(top,#F6F6F6 0%,#E6E6E6 100%);
background: linear-gradient(to bottom,#F6F6F6 0%,#E6E6E6 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f6f6f6',endColorstr='#e6e6e6',GradientType=0);
}
.box_wrapper_title1{
padding: 10px 12px 10px 12px;
font-size: 20px;
line-height: 21px;
color: #2E2E2E;
border-bottom: 1px solid #CFCFCF;
font-weight: bold;
-webkit-border-radius: 2px;
border-radius: 2px;
background: #F6F6F6;
background: -moz-linear-gradient(top,#F6F6F6 0%,#E6E6E6 100%);
background: -webkit-gradient(linear,left top,left bottom,color-stop(0%,#F6F6F6),color-stop(100%,#E6E6E6));
background: -webkit-linear-gradient(top,#F6F6F6 0%,#E6E6E6 100%);
background: -o-linear-gradient(top,#F6F6F6 0%,#E6E6E6 100%);
background: -ms-linear-gradient(top,#F6F6F6 0%,#E6E6E6 100%);
background: linear-gradient(to bottom,#F6F6F6 0%,#E6E6E6 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f6f6f6',endColorstr='#e6e6e6',GradientType=0);
}
.box_wrapper_title h1 {
font-size: 15px;
font-weight: bold;
}
.manu-info{
margin-bottom:20px;
}
.manu-info h5 a{
color:#333;
line-height:1.5em;
font-size:13px;
}
.sidebar-nav li {
background: #FEFEFE url(../images/bg3.gif) 0 bottom repeat-x;
line-height:3.2em;
font-size: 11px;
position: relative;
display: block;
}
.sidebar-nav li a {
padding: 11px 0 11px 17px;
text-transform: uppercase;
color:#333;
}
.sidebar-nav li a:hover{
color:#4B7092;
}
.top-index{
padding: 10px 0px 22px 0px;
margin: 0px 0px 18px 0px;
font-size: 1em;
border-bottom: 1px solid #CCC;
}
.top-index a {
color: #373737;
font-weight: normal;
text-decoration: none;
display: inline-block;
font-size:15px;
}
.top-index a.last {
color:#4B7092;
}
.top-index a.last:hover{
color:#000;
}
.span_1_of_s {
width:41.2%;
margin-right: 4.7%;
float:left;
}
.span_2_of_s {
width:54.1%;
}
.cont1 {
display: block;
float: left;
margin:0% 0 1% 0;
}
.span_2_of_3 h5, .span_1_of_3 h5{
color:#4B7092;
margin-bottom: 0.5em;
font-size: 1.5em;
line-height: 1.2;
font-weight: normal;
margin-top: 0px;
letter-spacing: -1px;
}
h3.price1{
border-bottom:1px solid #ccc;
padding:0 0 20px;
}
h3.price1 b {
font-size: .6em;
font-weight: normal;
display: inline-block;
float: left;
margin-top: 5px;
color:#333;
}
span.productPrice{
color:#999;
font-weight: bold;
line-height:1em;
font-size:0.9em;
}
h2.head{
font-size:1.3em;
color:#4B7092;
padding:20px 0 10px;
}
span.smallText {
font-size:13px;
}
.span_2_of_s p{
color:#333;
border-bottom:1px solid #ccc;
padding:0 0 20px;
}
.options {
padding: 20px 0px 10px 0px;
border-bottom: 1px solid #CCC;
}
p.options-title {
border-bottom:0px;
}
.options-title {
color: #323232;
font-size: 1.1em;
font-weight: bold;
padding: 0px 0px 10px 0px;
}
.options ul {
padding: 0px;
margin: 0px 0px 0px -20px;
list-style: none;
}
.options ul li {
float: left;
padding: 0px 0px 10px 20px;
}
.options label {
float: left;
margin-top:10px;
}
.options select{
border: 1px solid #D4D4D4;
background:#fff;
color:#333;
outline: none;
padding: 5px;
}
p.desc{
margin-top:20px;
color:#333;
line-height:1.5em;
border-bottom:0;
}
/*--About--*/
.about-top-pagination {
padding: 10px 12px 10px 12px;
font-size: 20px;
line-height: 21px;
color: #2E2E2E;
border-bottom: 1px solid #CFCFCF;
font-weight: bold;
-webkit-border-radius: 2px;
border-radius: 2px;
background: #F6F6F6;
background: -moz-linear-gradient(top,#F6F6F6 0%,#E6E6E6 100%);
background: -webkit-gradient(linear,left top,left bottom,color-stop(0%,#F6F6F6),color-stop(100%,#E6E6E6));
background: -webkit-linear-gradient(top,#F6F6F6 0%,#E6E6E6 100%);
background: -o-linear-gradient(top,#F6F6F6 0%,#E6E6E6 100%);
background: -ms-linear-gradient(top,#F6F6F6 0%,#E6E6E6 100%);
background: linear-gradient(to bottom,#F6F6F6 0%,#E6E6E6 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f6f6f6',endColorstr='#e6e6e6',GradientType=0);
}
.about-top-pagination ul li {
display: inline-block;
}
.about-top-pagination ul li a {
color: #797979;
font-size:20px;
}
.about-top-pagination ul li a span {
color:#547D9F;
}
.about-topgrid1 {
width: 29%;
float: left;
margin-right: 5%;
}
.about-topgrid1 h3 {
color:#547D9F;
font-size: 24px;
padding: 15px 0px 15px 0px;
border-bottom: 1px solid #C0C0C0;
margin-bottom: 13px;
}
.about-topgrid1 h4 {
color: #7E7E7E;
font-size: 18px;
line-height: 1.5em;
}
.about-topgrid1 p {
font-size: 0.8125em;
color:#555;
line-height: 1.5em;
padding: 4px 0px 8px 0px;
}
.about-histore {
float: left;
width: 30%;
}
.about-services {
width: 30%;
float: left;
margin-left: 5%;
}
.about-histore ul li span {
color: #000;
font-size: 14px;
padding: 15px 0px 15px 0px;
margin-bottom: 13px;
float: left;
width: 15%;
}
.about-topgrid1 h5{
color: #7E7E7E;
font-size: 18px;
line-height: 1.5em;
}
.about-histore ul li p {
font-size: 0.8125em;
color:#555;
line-height: 1.5em;
padding: 4px 0px 8px 0px;
float: right;
width: 83%;
}
.about-top{
padding:1.5%;
}
.about-histore h3 {
color:#547D9F;
font-size: 24px;
padding: 15px 0px 15px 0px;
border-bottom: 1px solid #C0C0C0;
margin-bottom: 13px;
}
.about-services h3 {
color:#547D9F;
font-size: 24px;
padding: 15px 0px 15px 0px;
border-bottom: 1px solid #C0C0C0;
margin-bottom: 13px;
}
.about-services h5{
color: #7E7E7E;
font-size: 18px;
line-height: 1.5em;
}
.about-services p {
font-size: 0.8125em;
color:#555;
line-height: 1.5em;
padding: 4px 0px 8px 0px;
}
.about-services ul li a {
color: #574839;
font-size: 13px;
line-height: 2.3em;
}
.ourteam h3 {
color:#547D9F;
font-size: 24px;
padding: 15px 0px 0px 16px;
}
p.link a{
color:#000;
}
p.link a:hover{
text-decoration:underline;
}
/*--Contact--*/
/* Contact Form ============================================================================= */
.col{
display: block;
float:left;
margin: 1% 0 1% 1.6%;
}
.col:first-child{
margin-left:0;
}
.span_2_of_3 {
width: 63.1%;
padding:1.5%;
}
.span_1_of_3 {
width: 29.2%;
padding:1.5%;
}
.contact-form{
position:relative;
padding-bottom:30px;
}
.contact-form div{
padding:5px 0;
}
.contact-form span{
display:block;
font-size:0.8125em;
color: #333;
padding-bottom:5px;
}
.contact-form input[type="text"],.contact-form textarea{
padding:8px;
display:block;
width:98%;
background:#fcfcfc;
border: none;
outline:none;
color:#464646;
font-size:0.8125em;
font-family:Arial, Helvetica, sans-serif;
box-shadow: inset 0px 0px 3px #999;
-webkit-box-shadow: inset 0px 0px 3px #999;
-moz-box-shadow: inset 0px 0px 3px #999;
-o-box-shadow: inset 0px 0px 3px #999;
-webkit-appearance:none;
}
.contact-form textarea{
resize:none;
height:120px;
}
.company_address p{
font-size:0.8125em;
color:#333;
}
.company_address p span{
text-decoration:underline;
color:#333;
cursor:pointer;
}
.map{
border:1px solid #C7C7C7;
margin-bottom:15px;
}
/***** Media Quries *****/
@media only screen and (max-width: 1024px) {
.wrap{
width:95%;
}
}
/* GO FULL WIDTH AT LESS THAN 800 PIXELS */
@media only screen and (max-width: 800px) {
.wrap{
width:95%;
}
.span_2_of_3 {
width:94%;
padding:3%;
}
.col{
margin: 1% 0 1% 0%;
}
.span_1_of_3 {
width:94%;
padding:3%;
}
}
/* GO FULL WIDTH AT LESS THAN 640 PIXELS */
@media only screen and (max-width: 640px) and (min-width: 480px) {
.wrap{
width:95%;
}
.span_2_of_3 {
width:94%;
padding:3%;
}
.col{
margin: 1% 0 1% 0%;
}
.span_1_of_3 {
width:94%;
padding:3%;
}
.contact-form input[type="text"],.contact-form textarea{
width:97%;
}
}
/* GO FULL WIDTH AT LESS THAN 480 PIXELS */
@media only screen and (max-width: 480px) {
.wrap{
width:95%;
}
.span_2_of_3 {
width:90%;
padding:5%;
}
.col {
margin: 1% 0 1% 0%;
}
.span_1_of_3 {
width:90%;
padding:5%;
}
.contact-form input[type="text"],.contact-form textarea{
width:92%;
}
}
.contact_info{
padding:1.5%;
}
.contact-form input[type="submit"] {
font-size: 1em;
padding: 10px 15px;
font-family: 'ambleregular';
background:#547D9F;
color: #FFF;
border: none;
text-decoration: none;
outline: 0;
cursor: pointer;
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
position: absolute;
right: 0;
}
.contact-form input[type="submit"]:hover {
text-shadow: 0px 0px 1px #000;
background: #292929;
}
/*--404--*/
.page-not-found {
padding: 30px 0;
}
.page-not-found h1 {
font-size: 15em;
color: #F0F0F0;
text-align: center;
text-shadow: 1px 1px 6px #AAA;
-moz-text-shadow: 1px 1px 6px #aaa;
-webkit-text-shadow: 1px 1px 6px #aaa;
-o-text-shadow: 1px 1px 6px #aaa;
}
/*--Responsive--*/
@media (max-width:1366px){
.wrap{
width:90%;
}
.bot1 {
width: 57%;
}
.cart {
width: 44%;
}
}
@media (max-width:1280px){
.wrap{
width:90%;
}
.bot1 {
width: 57%;
}
.cart {
width:46%;
}
.cart1 {
padding: 11px;
}
.top-nav li {
width: 23.86%;
}
}
@media (max-width:1024px){
.wrap{
width:90%;
}
.bot1 {
width: 53%;
}
.cart {
width:51%;
}
.cart1 {
padding:7px;
}
.text1 {
font-size: 16px;
}
.text2 {
font-size: 20px;
}
a.details {
width: 37px;
height: 37px;
}
.text21 {
font-size: 20px;
}
.text20 {
font-size:15px;
}
.link-cart {
font-size: 13px;
font-weight:normal;
padding:-1px;
background: url(../images/arrow1.png)no-repeat 65px;
}
.product-details {
float:none;
width:100%;
}
.product-image {
float:none;
width:100%;
}
p.old-price {
float:none;
}
.sidebar1{
display:none;
}
.logo {
margin-top: -2%;
}
.span_2_of_3 h5, .span_1_of_3 h5 {
font-size: 1.3em;
}
.options ul li {
padding: 0px 0px 10px 11px;
}
}
@media (max-width:800px){
.wrap{
width:90%;
}
.bot1 {
width: 53%;
}
.cart {
width:60%;
}
.cart1 {
padding:7px;
}
.text1 {
font-size: 13px;
}
.text2 {
font-size:17px;
}
a.details {
width: 34px;
height: 34px;
}
.text21 {
font-size: 20px;
}
.text20 {
font-size:15px;
}
.link-cart {
font-size: 13px;
font-weight:normal;
padding:-1px;
background: url(../images/arrow1.png)no-repeat 65px;
}
.product-details {
float:none;
width:100%;
}
.product-image {
float:none;
width:100%;
}
p.old-price {
float:none;
}
.logo {
width: 30%;
}
a.button {
font-size:13px;
padding: 2.3% 5%;
}
.top-nav li a {
font-size:15px;
}
.product-name {
margin-bottom: 3%;
}
.about-topgrid1 {
width:100%;
float:none;
margin-right:0px;
}
.about-histore {
float:none;
width:100%;
}
.about-services {
width:100%;
float:none;
margin-left:0px;
}
}
@media (max-width:640px){
.wrap{
width:90%;
}
.bot1 {
width: 53%;
}
.cart {
width:60%;
}
.cart1 {
padding:4px;
}
.text1 {
font-size: 13px;
}
.text2 {
font-size:17px;
}
a.details {
width: 31px;
height: 31px;
}
.text21 {
font-size: 20px;
}
.text20 {
font-size:15px;
}
.link-cart {
font-size: 13px;
font-weight:normal;
padding:-1px;
background: url(../images/arrow1.png)no-repeat 65px;
}
.product-details {
float:none;
width:100%;
}
.product-image {
float:none;
width:100%;
}
p.old-price {
float:none;
}
.logo {
width: 30%;
}
a.button {
font-size:13px;
padding: 2.3% 5%;
}
.top-nav li a {
font-size:15px;
}
.product-name {
margin-bottom: 3%;
}
.about-topgrid1 {
width:100%;
float:none;
margin-right:0px;
}
.about-histore {
float:none;
width:100%;
}
.about-services {
width:100%;
float:none;
margin-left:0px;
}
.ph-no {
float: left;
margin-right:0px;
}
.login {
width:30px;
height:30px;
margin-right:5px;
}
.span_1_of_4 {
padding:1% 3%;
}
.span_1_of_4 h3 {
font-size:1.2em;
}
}
@media (max-width:480px){
.wrap{
width:90%;
}
.bot1 {
width: 53%;
}
.cart {
width:100%;
float:none;
}
.cart1 {
padding:7px;
}
.text1 {
font-size: 13px;
}
.text2 {
font-size:17px;
}
a.details {
width: 31px;
height: 31px;
}
.text21 {
font-size: 20px;
}
.text20 {
font-size:15px;
}
.link-cart {
font-size: 13px;
font-weight:normal;
padding:-1px;
background: url(../images/arrow1.png)no-repeat 65px;
}
.product-details {
float:none;
width:100%;
}
.product-image {
float:none;
width:100%;
}
p.old-price {
float:none;
}
.logo {
float:none;
width:70%;
}
a.button {
font-size:13px;
padding:1.9% 5%;
}
.top-nav li a {
font-size:15px;
}
.product-name {
margin-bottom: 3%;
}
.about-topgrid1 {
width:100%;
float:none;
margin-right:0px;
}
.about-histore {
float:none;
width:100%;
}
.about-services {
width:100%;
float:none;
margin-left:0px;
}
.ph-no {
float: left;
margin-right:20px;
}
.login {
width:30px;
height:30px;
margin-right:20px;
}
.span_1_of_4 {
padding: 1% 3%;
}
.span_1_of_bottom {
width:100%;
float: none;
margin-right:0px;
}
.grids {
float:none;
}
.span_1_of_bottom1 {
width:100%;
float:none;
}
.span_2_of_s {
width:100%;
}
.span_1_of_s {
width:100%;
margin-right:0px;
float:none;
}
}
@media (max-width:320px){
.wrap{
width:90%;
}
.bot1 {
width: 53%;
}
.cart {
width:100%;
float:none;
}
.cart1 {
padding:7px;
}
.text1 {
font-size: 11px;
padding-left:0px;
}
.text2 {
font-size:13px;
}
a.details {
width: 31px;
height: 31px;
}
.text21 {
font-size: 20px;
}
.text20 {
font-size:15px;
}
.link-cart {
font-size: 13px;
font-weight:normal;
padding:-1px;
background: url(../images/arrow1.png)no-repeat 65px;
}
.product-details {
float:none;
width:100%;
}
.product-image {
float:none;
width:100%;
}
p.old-price {
float:none;
}
.logo {
float:none;
width:70%;
}
a.button {
font-size:13px;
padding: 2.8% 5%;
}
.top-nav li a {
font-size:13px;
}
.product-name {
margin-bottom: 3%;
}
.about-topgrid1 {
width:100%;
float:none;
margin-right:0px;
}
.about-histore {
float:none;
width:100%;
}
.about-services {
width:100%;
float:none;
margin-left:0px;
}
.ph-no {
float: left;
margin-right:10px;
}
.login {
display:none;
}
.span_1_of_4 {
padding: 1% 3%;
}
.span_1_of_bottom {
width:100%;
float: none;
margin-right:0px;
}
.grids {
float:none;
}
.span_1_of_bottom1 {
width:100%;
float:none;
}
.span_2_of_s {
width:100%;
}
.span_1_of_s {
width:100%;
margin-right:0px;
float:none;
}
}
}